<template>
  <div class="container">
    <router-view :key="route.fullPath" />
  </div>
</template>

<script>
  import { reactive, onMounted, toRefs, watch } from "vue";
  import router from "@/router";
  import { useRoute, useRouter } from "vue-router";
  export default {
    setup() {
      const route = useRoute();
      const state = reactive({
        route: ''
      })
      onMounted(() => {
      })
      watch(() => route.fullPath,
        (newValue, oldValue) => {
          state.route = newValue
        },
        { immediate: true }
      )
      return {
        ...toRefs(state),
      };
    },
  };
</script>
<style>
  body {
    --van-tabbar-height: 50px;
    --van-tabbar-item-icon-size: 24px
  }
</style>